<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1 id="box"></h1>
    <script>
        function addZero(n){
           return n>9?n:"0"+n;
        }
         function showTime(endTime){
             var enddDate=new Date(endTime);
             var date=new Date();
             //时间差  毫秒数
             var diffTime=enddDate-date;
             console.log(diffTime);
             if(diffTime<=0){
                clearInterval(timer);
                timer=null;
                return "活动已经结束";
             }
             
             var day=Math.floor(diffTime/(24*60*60*1000));
             var hours=Math.floor(diffTime/(60*60*1000)%24);
             var minutes=Math.floor(diffTime/(60*1000)%60);
             var seconds=Math.floor(diffTime/1000%60);

            //  var str="";
            //  if(day!==0){
            //     str+=`${day}天,`
            //  }
            //  str +=`${hours}时${minutes}分${seconds}秒`;
            //es6字符串模板可以做简单的js运算
            var str=`${day?`${day}天,`:""}${addZero(hours)}时${addZero(minutes)}分${addZero(seconds)}秒`
            return str;
         }
         box.innerHTML=showTime("2023-6-19 18:00:00");

         var timer=null;
         timer=setInterval(()=>{
            box.innerHTML=showTime("2023-6-19 18:00:00");
         },1000)
    </script>
</body>
</html>